<template>
  <el-table :data="tableData" style="width: 100%" @row-click="handleCellClick">
    <el-table-column prop="ID" label="自习室号" width="180" />
    <el-table-column prop="Address" label="地址" />
    <el-table-column prop="UID" label="管理员" width="180" />
    <el-table-column prop="Length" label="座位数" width="90" />
  </el-table>
</template>

<script>
import {onMounted, ref} from "vue";
import API from "../plugins/axiosInstanse";
import router from "@/router";
import Seat from "@/components/Seat.vue";
import {ElMessage} from "element-plus";

export default {
  name: "Class",
  components:{Seat},
  setup(){
    const tableData = ref()
    onMounted(()=>{
      API.get('api/getClassList',{
        params:{
          phone:sessionStorage.getItem('phone'),
          pwd:sessionStorage.getItem('pwd')
        }
      }).then((response)=>{
        if(response.Rsp.Status){
          tableData.value = response.ClassList
        }
        else{
          router.push('/login')
        }
      })
    })
    const handleCellClick = (row) =>{
      router.push({
        path:'/seat',
        query:row
      })
    }
    return{
      tableData,
      handleCellClick
    }
  }
}
</script>

<style scoped>

</style>